<template>
  <jke-modal :width='1200' :visible.sync='jkeForm.visible' :title='jkeForm.title' :fullscreen.sync='jkeForm.fullscreen'
    :switchFullscreen='jkeForm.switchFullscreen'>
    <div class='form-body' :style="{ height: jkeForm.fullscreen ? 'calc(100vh - 112px)' : 'auto' }">
      <a-card title='基础信息' :bordered='false' class='no-title-line-card' style='margin-top: 12px'>
        <a-form :form='form' @submit='submitProcess' layout='vertical'>
          <a-form-item label='订单编号' prop='orderCode'>
            <a-input v-decorator="[
              'orderCode',
              {
                rules: [
                  {
                    message: '请输入订单编号或自动生成',
                  },
                ],
              },
            ]" placeholder='请输入，不输入则自动生成' :maxLength='21' />
          </a-form-item>
          <a-form-item label='客户' prop='orderCustomId'>
            <a-input @click='selectCustomerTable()'
              v-decorator="['orderCustomIdText', { rules: [{ message: '请选择客户' }] }]" placeholder='请选择'
              :read-only='true'>
              <a-icon slot='suffix' type='down' style='color: #cdcdcd; font-size: 12px' class='down-icon' />
              <a-icon slot='suffix' type='close-circle' theme='filled' class='close-icon'
                @click="getSelectValueProcess(false, '', [], '')" />
            </a-input>
          </a-form-item>

          <a-form-item label='交货日期' prop='deliveryDate'>
            <a-date-picker style="width: 100%;" format="YYYY-MM-DD" v-decorator="[
              'deliveryDate'
            ]" />
          </a-form-item>

          <a-form-item>
            <a-input v-show='false' v-decorator="['orderCustomId', { rules: [{ message: '请选择客户' }] }]">
            </a-input>
          </a-form-item>

        </a-form>
      </a-card>

      <createFormItem ref='createFormItemRef' :formType='2' />

      <a-card title='销售物品明细' :bordered='false' class='no-title-line-card'
        style='margin-top: 12px; margin-bottom: 12px; flex: 1'>
        <a-col :span='24' style='margin-bottom: 38px'>
          <j-editable-table ref='saleGoodsTable' :loading='saleGoodsTable.loading' :rowNumber='true' rowNumberText='序号'
            :columns='saleGoodsTable.columns' :dataSource='saleGoodsTable.dataSource' :maxHeight='610'
            :disabled='formDisabled' :actionButton='true' @valueChange='valueChange' :rowSelection='true'
            :addActionButton='false'>
            <template #options>
              <a-button @click='selectGoodsTable' type='primary' class='btns' icon='plus'
                style='margin-right: 8px; border-radius: 4px; height: 32px; width: 76px'>添加
              </a-button>
            </template>
            <template #importButton>
              <PubImport ref='PubImport' tableCode='MESS_PRODUCT_FLOW' modelName='物品明细导入模板'
                @getImportData='getImportData' :formType="'11'" />
            </template>
            <template v-slot:processCodeName='props'>
              <a-input @click='selectGoodsTable(props)' :value='props.value' placeholder='请选择' :read-only='true'
                :class="props.value ? 'has-value' : ''">
                <a-icon slot='suffix' type='down' style='color: #cdcdcd; font-size: 12px' class='down-icon' />
                <a-icon slot='suffix' type='close-circle' theme='filled' class='close-icon'
                  @click="getSelectValueProcess(false, '', [], props.rowId)" />
              </a-input>
            </template>

            <template v-slot:excessWorkRate='props'>
              <a-input :value='props.value' placeholder='请输入'
                @input="(e) => inputNums(props, e, 'excessWorkRate', 'saleGoodsTable')" />
            </template>
            <template v-slot:processRequire='props'>
              <a-input :value='props.value' placeholder='请输入' :maxLength='500'
                @input="(e) => inputRequire(props, e, 'processRequire', 'saleGoodsTable')" />
            </template>
            <template v-slot:action='props'>
              <a-popconfirm title='是否删除?' ok-text='是' cancel-text='否' @confirm='handleDelete(props)' @cancel='cancel'>
                <a style='padding-left: 3px; color: #f25643'>删除</a>
              </a-popconfirm>
            </template>

            <template v-slot:goodsId='props'>
              <a-input placeholder='请选择' :read-only='true' @click='showSelect(props)' :value='goodsNameText(props)'
                :class="goodsNameText(props) ? 'has-value' : ''">
                <a-icon slot='suffix' type='down' style='color: #cdcdcd; font-size: 12px' class='down-icon' />
                <a-icon slot='suffix' type='close-circle' theme='filled' class='close-icon'
                  @click="getSelectValueSinger(false, '', [], props.rowId)" />
              </a-input>
            </template>
          </j-editable-table>
        </a-col>
      </a-card>
    </div>
    <div class='footer-submit' :class="jkeForm.fullscreen ? 'form-footer' : ''">
      <a-button @click='closeBtn' class='submitBtn' style='margin-right: 10px'> 取消</a-button>
      <a-button type='primary' :loading='loadingSubmit' class='submitBtn' @click='saveForm()'> 提交</a-button>
    </div>
    <tableSelect ref='tableSelect' @getSelectValue='getSelectValueSinger'>
      <div slot='head'>
        <div class='uni-card' style='background: #fff'>
          <a-form-model ref='ruleForm' layout='inline'></a-form-model>
        </div>
      </div>
    </tableSelect>
    <tableSelect ref='tableSelectSaleGoods' @getSelectValue='getSelectValueProcess' :key='indexProcess'
      @cancel='searchResetProcess'>
      <div slot='head'>
        <div class='uni-card' style='background: #fff'></div>
      </div>
    </tableSelect>

    <tableSelect ref='tableSelectSaleCustomer' @getSelectValue='getSelectCustomerValue'
      @cancel='$refs.tableSelectSaleCustomer.searchReset()'>
    </tableSelect>
  </jke-modal>
</template>
<script>
import { FormTypes } from '@/utils/JEditableTableUtil'
import crumbs from '@/components/crumbs.vue'
import { getFileListByIds } from '@/api/api'
import FileUpload from '@/components/fileActions/FileUpload.vue'
import { API } from '@/api/requestFzs'
import { apiBaseUrlDownload } from '@/utils/request'
import { APILX } from '@/api/requestLx'
import { validateDuplicateValue } from '@/utils/util'
import { accMul, accDivMin } from '@/utils/util'
import Examine from '@/components/examine'
import tableSelect from '@/components/tableSelect'
import createFormItem from '@/components/createForm.vue'
import {
  queryOptionList,
  inventoryApi,
} from '@/api/productOrder'
import JEditableTable from '@/components/jeecg/JEditableTable.vue'
import PubImport from '@/components/pubBtn/PubImport.vue'
import { cusColumns } from './column'
export default {
  name: 'customerForm',
  data() {
    let selectGoodColumn = [
      {
        title: '物品编号',
        dataIndex: 'serialNumber',
        ellipsis: true,
        width: 200,
        searchIndex: 'serialNumber',
        scopedSlots: {
          filterDropdown: 'searchDropdown',
          filterIcon: 'searchIcon',
          customRender: 'serialNumber'
        }
      },
      {
        title: '物品名称',
        dataIndex: 'serialName',
        ellipsis: true,
        width: 180,
        searchIndex: 'serialName',
        options: [],
        scopedSlots: {
          filterDropdown: 'searchDropdown',
          filterIcon: 'searchIcon',
          customRender: 'serialName'
        }
      },
      {
        title: '规格',
        dataIndex: 'serialSpecifications',
        ellipsis: true,
        width: 180,
        searchIndex: 'serialSpecifications',
        options: [],
        scopedSlots: {
          filterDropdown: 'searchDropdown',
          filterIcon: 'searchIcon',
          customRender: 'serialSpecifications'
        }
      },
      {
        title: '物品属性',
        dataIndex: 'serialProperties',
        ellipsis: true,
        width: 180,
        multi: 'multiple',
        searchIndex: 'serialPropertiesCode',
        options: [
          { label: '自制', key: '0' },
          { label: '外购', key: '1' }
        ],
        scopedSlots: {
          filterDropdown: 'selectDropdown',
          filterIcon: 'dateIcon',
          customRender: 'serialProperties'
        }
      },
      {
        title: '单位',
        dataIndex: 'unitName',
        ellipsis: true,
        // fixed: 'left',
        width: 180,
        searchIndex: 'unitName',
        options: [],
        scopedSlots: {
          customRender: 'unitName'
        }
      },
      {
        title: '工艺路线',
        dataIndex: 'processRouteName',
        ellipsis: true,
        // fixed: 'left',
        width: 180,
        searchIndex: 'processRouteName',
        options: [],
        scopedSlots: {
          filterDropdown: 'searchDropdown',
          filterIcon: 'searchIcon',
          customRender: 'processRouteName'
        }
      },
      {
        title: '最小库存',
        dataIndex: 'inventoryMin',
        ellipsis: true,
        // fixed: 'left',
        width: 180,
        searchIndex: 'inventoryMin',
        options: [],
        scopedSlots: {}
      },
      {
        title: '最大库存',
        dataIndex: 'inventoryMax',
        ellipsis: true,
        // fixed: 'left',
        width: 180,
        searchIndex: 'inventoryMax',
        options: [],
        scopedSlots: {}
      },
      {
        title: '创建时间',
        dataIndex: 'createTime',
        ellipsis: true,
        width: 180,
        searchIndex: 'createTime',
        sorter: true,
        scopedSlots: {}
      },
      {
        title: '更新时间',
        dataIndex: 'updateTime',
        ellipsis: true,
        width: 180,
        searchIndex: 'updateTime',
        sorter: true,
        scopedSlots: {}
      },
      {
        title: '创建人',
        dataIndex: 'createBy',
        ellipsis: true,
        width: 180,
        searchIndex: 'createBy',
        scopedSlots: {
          filterDropdown: 'selectPeople1',
          filterIcon: 'dateIcon',
          customRender: 'createByName'
        }
      },
      {
        title: '更新人',
        dataIndex: 'updateBy',
        ellipsis: true,
        width: 180,
        searchIndex: 'updateBy',
        scopedSlots: {
          filterDropdown: 'selectPeople2',
          filterIcon: 'dateIcon',
          customRender: 'updateByName'
        }
      }
    ]
    return {
      jkeForm: {
        title: '新建订单',
        visible: false,
        fullscreen: true,
        switchFullscreen: true
      },
      indexProcess: 0.2,
      processDataVo: '',
      sendType: '',
      isLoading: false, //防止tab来回切换 导致数据重复渲染
      tabNor: '待盘点（0）',
      tabAbNor: '已盘点（0）',
      addOrEdit: true, //待盘点 true 已盘点false
      inventoryUserIdText: '',
      inventoryUserIdRealId: '',
      signUser: '', //盘点人 id
      warehouseIdEdit: '', //继续盘点 仓库ID
      domianURL: apiBaseUrlDownload, //表格图片展示
      getGoodsId: '', //选仓库取到的id
      //新建时候 获取明细
      selectRowKeys: [],
      selectRowKeysEd: [],
      selectGoodsIds: [],
      selectGoodsIdsEd: [],
      validateDuplicateValue, //自动生成编码
      queryId: '',
      loadingSubmit: false, //防止多次提交
      submitApi: API.saleOrderInfoAdd,
      queryParam: {},
      isEdit: false,
      mainDivWidth: 0,
      attachment: '', //附件
      form: this.$form.createForm(this, { name: 'coordinated' }),
      reloadForm: false,
      outWarehouseType: [],
      customSelectList: [], //客户下拉
      saleGoodsTable: {
        loading: false,
        dataSource: [],
        columns: [
          {
            title: '物品',
            width: '22%',
            key: 'goodsId',
            type: FormTypes.slot,
            placeholder: '请选择',
            slotName: 'goodsId',
            options: [],
            isrequired: true,
            allowSearch: true,
            defaultValue: ''
          },
          {
            title: '规格',
            key: 'serialSpecifications',
            dataIndex: 'serialSpecifications',
            width: '12%'
          },
          {
            title: '单位',
            key: 'unitName',
            dataIndex: 'unitName',
            width: '12%'
          },
          {
            title: '数量',
            key: 'inWarehouseNum',
            width: '15%',
            isrequired: true,
            type: FormTypes.inputNumber,
            validateRules: [
              {
                required: true, // 必填
                message: '${title}不能为空'
              },
              {
                //    ^(0|[1-9]\d{0,11})(\.\d{1,4})?$
                pattern: /^(0\.[0-9]{1,4}|[1-9][0-9]{0,11}(\.[0-9]{1,4})?)$/, // 正则
                message: '${title}只能输入大于0的，最多16位，小数点后4位'
              }
            ]
          }
        ]
      },
      selectGoodColumn,
      cusColumns,
      goodsProps: {},
      formType: 8,
    }
  },
  components: {
    FileUpload,
    Examine,
    crumbs,
    tableSelect,
    JEditableTable,
    createFormItem,
    PubImport
  },
  created() {
    this.getdata()
  },
  mounted() {
    let mainDiv = document.querySelector('.ant-layout-content') //ant-layout-content
    this.mainDivWidth = `${mainDiv.clientWidth}px`
  },
  computed: {
    formDisabled() {
      if (this.formBpm === true) {
        if (this.formData.disabled === false) {
          return false
        }
        return true
      }
      return this.disabled
    }
  },
  methods: {
    getImportData(data) {
      let list = JSON.parse(JSON.stringify(this.saleGoodsTable.dataSource))
      const { error, values: tableValues } = this.$refs.saleGoodsTable.getValuesSync({ validate: true })
      let realList = []
      list.forEach((item) => {
        tableValues.map((i) => {
          if (i.id == item.id) {
            realList.push(item)
          }
        })
      })
      console.log(' alist', realList)
      data.forEach((item) => {
        item.inWarehouseNum = item.num
        item.serialSpecifications = item.serialSpecifications || '-'
        item.unitName = item.unitName || '-'
      })
      this.saleGoodsTable.dataSource = [...realList, ...data]
    },
    onChangeUser(v, index) {
      this.queryParam[index] = v
        .map((e) => {
          return e.id
        })
        .toString()
      this.queryParam[`${index}realname`] = v
        .map((e) => {
          return e.realname
        })
        .toString()
      this.queryParam[`${index}username`] = v
        .map((e) => {
          return e.username
        })
        .toString()
    },
    // 选择客户后的逻辑
    getSelectCustomerValue(id, text, item) {
      console.log(556, id, text, item)
      this.form.setFieldsValue({
        orderCustomId: id,
        orderCustomIdText: text
      })
    },
    getSelectValueProcess(id, text, item, rowId) {
      // 这里需要判断，原先列表中是否有值，只添加列表中没有的

      // 获取

      console.log(this.$refs.saleGoodsTable)
      let { error, values } = this.$refs.saleGoodsTable.getValuesSync({ validate: false })

      console.log(values, 'valuesvaluesvaluesvaluesvaluesvaluesvaluesvaluesvalues')

      item.forEach((ele) => {
        if (!this.saleGoodsTable.dataSource.find((ele2) => ele2.id == ele.id)) {
          this.saleGoodsTable.dataSource.push({
            id: ele.id,
            inWarehouseNum: '',
            serialName: ele.serialName || '-',
            serialNumber: ele.serialNumber || '-',
            serialSpecifications: ele.serialSpecifications || '-',
            unitName: ele.unitName || '-'
          })
        }
      })

      this.saleGoodsTable.dataSource.forEach((ele) => {
        values.forEach((ele2) => {
          if (ele.id == ele2.id) {
            ele.inWarehouseNum = ele2.inWarehouseNum
          }
        })
      })
    },
    // 选择商品回调-单选
    getSelectValueSinger(id, text, item, rowId) {
      this.selectIndex += 1 //重置组件去除表格默认勾选数据，让自己赋值的数据回显（重要！！！）

      const { error, values: tableValue } = this.$refs.saleGoodsTable.getValuesSync({ validate: true })
      for (let i = 0; i < tableValue.length; i++) {
        const item = tableValue[i]
        if (item.id == id) {
          this.$antdMessage.warning('该商品已存在，请直接修改数据')
          return
        }
      }
      // 找到需要替换的列
      let currentIndex = tableValue.findIndex((item) => {
        return item.id == this.goodsProps.rowId
      })
      this.saleGoodsTable.dataSource.splice(currentIndex, 1, {
        id: item[0].id,
        inWarehouseNum: '',
        serialName: item[0].serialName || '-',
        serialNumber: item[0].serialNumber || '-',
        serialSpecifications: item[0].serialSpecifications || '-',
        unitName: item[0].unitName || '-'
      })
    },
    searchResetProcess() {
      this.$refs.tableSelectSaleGoods.searchReset()
    },
    searchProcess() {
      this.$refs.tableSelectSaleGoods.searchQuery(this.filterFormProcess)
    },
    //  打开选择客户的弹窗表格
    selectCustomerTable(props) {
      this.form.validateFields((err, values1) => {
        let par = {
          list: '/sale/saleCustomInfo/list',
          visible: true, //弹窗开启
          title: '客户列表', //标题名称
          multi: false, //是否多选
          columns: this.cusColumns, //表格配置
          value: values1.orderCustomId, //需要回显的数据，如：id:'12323213,321312312'  this.goodsValue
          valueKey: 'id', //需要拿到数据的key，如：id，userId等
          text: values1.orderCustomIdText, //回显的中文，如：'张三'
          textKey: 'customName', //回显的中文key
          action: 'post'
        }
        this.$refs.tableSelectSaleCustomer.getInit(par)
      })

    },
    // 打开商品明细
    selectGoodsTable(props) {
      const { error, values: tableValues } = this.$refs.saleGoodsTable.getValuesSync({ validate: true })
      let goodsIds = ''
      if (!tableValues.length) {
        goodsIds = ''
      } else {
        goodsIds = tableValues
          .map((e) => {
            return e.id
          })
          .toString()
      }
      let par = {
        list: '/basicserial/basicSerialInfo/list',
        visible: true, //弹窗开启
        title: '商品明细列表', //标题名称
        multi: true, //是否多选
        columns: this.selectGoodColumn, //表格配置
        value: goodsIds, //需要回显的数据，如：id:'12323213,321312312'  this.goodsValue
        valueKey: 'id', //需要拿到数据的key，如：id，userId等
        text: this.goodsText, //回显的中文，如：'张三'
        textKey: 'serialName', //回显的中文key
        action: 'post'
      }
      this.$refs.tableSelectSaleGoods.getInit(par)
    },
    // 点击选择商品下拉框，弹出选择组件-单选
    showSelect(p) {
      this.goodsProps = p
      // var tableValue = this.$refs.goodsTable.getValuesSync({ validate: false, rowIds: [this.goodsProps.rowId] })
      // p.values[0]
      let par = {
        list: '/basicserial/basicSerialInfo/list',
        visible: true, //弹窗开启
        title: '商品明细列表', //标题名称
        multi: false, //是否多选
        columns: this.selectGoodColumn, //表格配置
        value: p.rowId, //需要回显的数据,this.goodsValue回显明细所有的，p.rowId是当前点击的
        valueKey: 'id', //需要拿到数据的key，如：id，userId等
        text: this.goodsText, //回显的中文，如：'张三'
        textKey: 'serialName', //回显的中文key
        action: 'post'
      }
      this.$refs.tableSelect.getInit(par)
    },
    minMax(value, callback) {
      console.log(value, this.form.getFieldValue('inventoryMax'))
      if (parseFloat(value) > parseFloat(this.form.getFieldValue('inventoryMax'))) {
        callback('true')
        return false
      }
      callback()
    },
    parseNumber(field) {
      let value = this.form.getFieldValue(field)
      console.log(value)

      // 解析用户输入的值
      if (value === '') {
        return 0
      }
      // 去除非数字和小数点的字符
      const newValue = value.replace(/[^\d.]/g, '')
      // 分割整数和小数部分
      const parts = newValue.split('.')
      // 获取整数和小数部分的值
      let integer = parts[0]
      let decimal = parts[1]
      // 限制整数部分最多4位
      // if (integer.length > 4) {
      //   integer = integer.slice(0, 4)
      // }
      // 限制小数部分最多4位
      if (decimal && decimal.length > 4) {
        decimal = decimal.slice(0, 4)
      }
      // 拼接整数和小数部分
      let parsedValue = integer
      if (newValue.includes('.')) {
        parsedValue += '.'
      }
      if (decimal) {
        parsedValue += decimal
      }

      let values = {}
      values[field] = parsedValue
      console.log(values)
      this.form.setFieldsValue(values)
      // 将解析后的值转为数字类型
      return ''
    },
    maxMin(value, callback) {
      if (parseFloat(value) < parseFloat(this.form.getFieldValue('inventoryMin'))) {
        callback('true')
        return false
      }
      callback()
    },

    operaChange(a, b) {
      this.form.setFieldsValue({ inWarehouseTime: a.format('YYYY-MM-DD HH:mm') })
      this.$forceUpdate()
    },
    async getDic() {
      APILX.warehouseEntryInfoEntryType().then((res) => {
        this.outWarehouseType = JSON.parse(JSON.stringify(res.result))
      })
      let res = await APILX.formTypeExtendedFieldList({ formType: 8 })
      console.log('res--------', res)
      if (res.code == 200 && res.result) {
        let formTypeExtendedFields = res.result
        let columns = []
        formTypeExtendedFields.forEach((fields) => {
          let tableHead = {
            title: fields.fieldName,
            dataIndex: 'extDataJson.' + fields.fieldKey,
            ellipsis: true,
            width: 150,
            searchIndex: 'extDataJson.' + fields.fieldKey,
            scopedSlots: {
              filterDropdown: 'searchDropdown',
              filterIcon: 'searchIcon'
            }
          }
          columns.push(tableHead)
        })
        this.selectGoodColumn = [...this.selectGoodColumn, ...columns]
        console.log('this.selectGoodColumn', this.selectGoodColumn)
      }
    },
    goodChange(item) {
      this.form.goodsSpec = item.spec
      this.form.goodsTypeName = item.type
      this.form.goodsTypeNameText = item.typeText
      this.form.basicUnit = item.basicUnit
      this.form.basicUnitText = item.basicUnitText
      this.form.goodsId = this.goodsValue
      this.form.goodsCodeName = `${item.goodsCode}-${item.goodsName}`
      this.$refs['ruleFormTwo'].validateField(['goodsId'])
      let craftObj = {
        pageNo: this.craft_pageNo,
        pageSize: this.craft_pageSize,
        goodsId: this.form.goodsId
      }
      queryOptionList(craftObj).then((res) => {
        if (res.success) {
          this.craftList = res.result.records
          this.form.craftId = undefined
          if (res.result.total && res.result.total === 1) {
            // 若选中的产品关联了工艺路线，则优先默认把工艺路线的信息回填到子表
            this.form.craftId = this.craftList[0].value
            this.craftText = this.craftList[0].text
            this.craftValue = this.craftList[0].value
            this.craftChange(this.form.craftId)
          } else {
            // 若没有关联工艺路线，且物料分类只关联了一个生产流程，则默认把对应生产流程的信息回填到子表
            this.$refs.craftPath.initialize()
            this.getGoodsFlow()
          }
        } else {
          this.$antdMessage.warning(res.message)
        }
      })
      let inventoryObj = {
        pageNo: 1,
        pageSize: 999,
        goodsId: this.form.goodsId
      }
      this.inventoryParams.loading = true
      inventoryApi(inventoryObj).then((res) => {
        if (res.success) {
          if (res.result) {
            let newArr = res.result.records
            newArr = newArr.map((item) => {
              if (this.form.num) {
                item.planTotalNum =
                  Number(this.form.num) *
                  (Number(item.basicUseLevel) + Number(item.basicUseLevel) * Number(item.loss / 100))
                return item
              } else {
                return item
              }
            })
            console.log(newArr)
            this.inventoryParams.dataSource = newArr
          } else {
            this.inventoryParams.dataSource = []
            // this.$antdMessage.warning('该产品BOM未配置')
          }
        } else {
          this.$antdMessage.warning(res.message)
        }
        this.inventoryParams.loading = false
      })
      this.$forceUpdate()
    },
    getSelectValue(id, text, item) {
      this.form.setFieldsValue({
        processRouteId: id,
        processRouteIdText: text,
      })
    },
    // 选择合格品单位
    qualifiedChange(e, props, key) {
      let { unitList, rateQOld, inventoryGoodsQualifiedNum } = this.$refs[key].getValuesSync({
        validate: false,
        rowIds: [props.rowId]
      }).values[0]
      // console.log('inventoryGoodsQualifiedNum:',inventoryGoodsQualifiedNum,'-','rateQOld:',rateQOld);
      let old_num = inventoryGoodsQualifiedNum
        ? accMul(inventoryGoodsQualifiedNum, rateQOld)
        : '' /* 当前数值乘以单位换算比例，得到对应的基本单位数量 */
      let unit = JSON.parse(unitList).find((item) => item.id == e)
      this.$refs[key].setValues([
        {
          rowKey: props.rowId,
          values: {
            rateQ: unit.conversionRate,
            rateQOld: unit.conversionRate,
            selectUnitQ: e,
            inventoryGoodsQualifiedNum: inventoryGoodsQualifiedNum
              ? accDivMin(old_num, unit.conversionRate)
              : '' /* 基本单位数量除以辅助单位比例，得到当前数值对应辅助单位数量 */
          }
        }
      ])
    },
    // 选择报废品单位
    scrapNumChange(e, props, key) {
      let { unitList, rateSOld, inventoryGoodsScrapNum } = this.$refs[key].getValuesSync({
        validate: false,
        rowIds: [props.rowId]
      }).values[0]
      let old_num = inventoryGoodsScrapNum ? accMul(inventoryGoodsScrapNum, rateSOld) : ''
      let unit = JSON.parse(unitList).find((item) => item.id == e)
      this.$refs[key].setValues([
        {
          rowKey: props.rowId,
          values: {
            rateS: unit.conversionRate,
            rateSOld: unit.conversionRate,
            selectUnitS: e,
            inventoryGoodsScrapNum: inventoryGoodsScrapNum ? accDivMin(old_num, unit.conversionRate) : ''
          }
        }
      ])
    },
    dataSourceItem(props, key, ediKey) {
      let item = this.$refs[ediKey].getValuesSync({ validate: false, rowIds: [props.rowId] }).values[0]
      let val = item[key]
      if (key == 'unitList') {
        return JSON.parse(val)
      } else {
        return val
      }
    },
    closeBtn() {
      this.jkeForm.visible = false
      // this.submitProcess()
    },
    // 提交（必须使用名为submitProcess方法进行提交）
    submitProcess(e) {
      if (e && e.nodeDtos) {
        this.processDataVo = e
        // console.log(e, this.processDataVo, 'processDataVo')
        // 获取到数据后写表单提交的方法
        this.saveForm(this.sendType)
      } else {
        // 调用子组件的方法获取数据
        this.$refs.examine.confirm()
      }
    },
    // tab分页
    changeCurrent(key) {
      if (key == '1') {
        // this.selectRowKeys = []
        this.addOrEdit = false
        // this.getAbleTableList() //已盘点
      } else {
        // this.selectRowKeys = []
        this.addOrEdit = true // 待盘点
      }
      //   this.getData()
    },
    // 分页
    onChangePage(current, pageSize) {
      this.getGoodsListPage.current = current
      if (this.queryId) {
      } else {
        this.getGoodsList()
      }
    },
    onShowSizeChange(current, pageSize) {
      this.getGoodsListPage.pageSize = pageSize
      this.getGoodsListPage.current = current
      if (this.queryId) {
      } else {
        this.getGoodsList()
      }
    },

    selectRowChange(ids) {
      this.selectRowKeys = ids
      if (this.selectRowKeys.length !== 0) {
        this.selectRowKeys.forEach((item) => {
          var tableValue = this.$refs.goodsTable.getValuesSync({ validate: false, rowIds: [item] }).values[0]
          if (!tableValue.inventoryGoodsQualifiedNum && !tableValue.inventoryGoodsScrapNum) {
            this.$refs.goodsTable.setValues([
              {
                rowKey: item, // 行的id
                values: {
                  // 在这里 values 中的 specifications 是你 columns 中配置的 key
                  inventoryGoodsQualifiedNum: tableValue.goodsQualifiedNum
                    ? accDivMin(tableValue.goodsQualifiedNum, tableValue.rateQ)
                    : '',
                  inventoryGoodsScrapNum: tableValue.goodsScrapNum
                    ? accDivMin(tableValue.goodsScrapNum, tableValue.rateS)
                    : '',
                  pdAmountExcludingTax: tableValue.amountExcludingTax
                }
              }
            ])
          }
        })
      }
    },
    validateunitName(value, callback) {
      if (this.isEdit && this.queryParam.processesName == value) {
        callback()
        return false
      }
      APILX.basicProductionProcessesQueryByProcessesName({ processesName: value }).then((res) => {
        console.log(res)

        !res.result ? callback() : callback('单位值不能重复')
      })
    },

    // 工序弹窗事件-----end
    searchResetGoods() {
      this.filterForm.goodsCode = ''
      this.filterForm.goodsName = ''
      this.$refs.tableSelect.searchReset()
    },
    searchGoods() {
      this.$refs.tableSelect.searchQuery(this.filterForm)
    },
    // 分页
    onChangePageEd(current, pageSize) {
      this.getGoodsListPageEd.current = current
      this.getAbleTableList()
    },
    onShowSizeChangeEd(current, pageSize) {
      this.getGoodsListPageEd.pageSize = pageSize
      this.getGoodsListPageEd.current = current
      this.getAbleTableList()
    },

    selectRowChangeEd(ids) {
      this.selectRowKeysEd = ids
      console.log(this.selectRowKeysEd, 'selectRowChangeEd')
      if (this.selectRowKeysEd.length !== 0) {
        this.selectRowKeysEd.forEach((item) => {
          var tableValue = this.$refs.getValuesSync({ validate: false, rowIds: [item] }).values[0]
          this.selectGoodsIdsEd.push(tableValue.goodsId)
          if (!tableValue.inventoryGoodsQualifiedNum && !tableValue.inventoryGoodsScrapNum) {
            this.$refs.goodsTableEd.setValues([
              {
                rowKey: item, // 行的id
                values: {
                  // 在这里 values 中的 specifications 是你 columns 中配置的 key
                  // inventoryGoodsQualifiedNum: tableValue.goodsQualifiedNum || '',
                  // inventoryGoodsScrapNum: tableValue.goodsScrapNum || '',
                  inventoryGoodsQualifiedNum: tableValue.goodsQualifiedNum
                    ? accDivMin(tableValue.goodsQualifiedNum, tableValue.rateQ)
                    : '',
                  inventoryGoodsScrapNum: tableValue.goodsScrapNum
                    ? accDivMin(tableValue.goodsScrapNum, tableValue.rateS)
                    : ''
                }
              }
            ])
          }
        })
      }
    },
    // 已盘点 编辑
    getAbleTableList() {
      console.log('selectRowKeysEd', this.selectGoodsIdsEd)
      let param = {
        id: this.queryId,
        pageNo: this.getGoodsListPageEd.current,
        pageSize: this.getGoodsListPageEd.pageSize
      }
      this.goodsTableEd.dataSource = []
      this.isLoading = true
      // console.log(this.isLoading, ' getAbleTableList isLoadingisLoadingisLoading')
      APILX.wmsWarehouseInventoryCompleteList(param).then(async (res) => {
        if (res.code == 200) {
          // console.log(res, '进来了没warehouseInventoryUnCompleteList')
          let tableData = res.result.records
          for (let i = 0; i < tableData.length; i++) {
            let item = tableData[i]
            const unitRes = await API.findUnitListByGoodsIdSync({ goodsId: item.goodsId })
            item.unitList = JSON.stringify(unitRes.result)
            if (item.goodsQualifiedUnitId) {
              let unitQ = unitRes.result.find((u) => u.id == item.goodsQualifiedUnitId)
              let unitS = unitRes.result.find((u) => u.id == item.goodsScrapUnitId)
              item.selectUnitQ = unitQ ? unitQ.id : unitRes.result[unitRes.result.length - 1].id
              item.selectUnitS = unitS ? unitS.id : unitRes.result[unitRes.result.length - 1].id

              item.rateQ = unitQ ? unitQ.conversionRate : 1
              item.rateQOld = unitQ ? unitQ.conversionRate : 1

              item.rateS = unitS ? unitS.conversionRate : 1
              item.rateSOld = unitS ? unitS.conversionRate : 1

              item.inventoryGoodsQualifiedNum = accDivMin(item.inventoryGoodsQualifiedNum, item.rateQ)
              item.inventoryGoodsScrapNum = accDivMin(item.inventoryGoodsScrapNum, item.rateS)
            } else {
              item.rateQ = 1
              item.rateS = 1
              item.rateQOld = 1
              item.rateSOld = 1
              item.selectUnitQ = unitRes.result[unitRes.result.length - 1].id
              item.selectUnitS = unitRes.result[unitRes.result.length - 1].id
            }
          }
          tableData.forEach((item) => {
            if (item.attachment) {
              let ids = item.attachment
              getFileListByIds({ ids }).then((res) => {
                if (res.code == 200) {
                  let fileList = ''
                  fileList = res.result
                  if (fileList.length > 0) {
                    item.picUrl = this.domianURL + fileList[0].uri
                    this.goodsTableEd.dataSource.push(item)
                  } else {
                    item.picUrl = require('../../../assets/img/noPicture.jpg')
                    this.goodsTableEd.dataSource.push(item)
                  }
                }
              })
            } else {
              item.picUrl = require('../../../assets/img/noPicture.jpg')
              this.goodsTableEd.dataSource.push(item)
            }
            if (item.inventoryGoodsQualifiedNum == '-') {
              item.inventoryGoodsQualifiedNum = 0.0
            }
            if (item.inventoryGoodsScrapNum == '-') {
              item.inventoryGoodsScrapNum = 0.0
            }
          })
          this.getGoodsListPageEd.total = res.result.total
          let _that = this
          setTimeout(() => {
            _that.isLoading = false
            console.log(_that.selectGoodsIdsEd, 'this.goodsTableEd.dataSource')
            const { error, values } = _that.$refs.goodsTableEd.getValuesSync({ validate: false })
            let ids = []
            let goods = values.filter((item) => _that.selectGoodsIdsEd.includes(item.goodsId))
            // console.log('aaaaaa',aaa);
            for (let g = 0; g < goods.length; g++) {
              ids.push(goods[g].id)
            }
            _that.$refs.goodsTableEd.setSelection(ids)
          }, 1000)
          // this.isLoading = false
        } else {
          this.$antdMessage.error(res.message)
          this.isLoading = false
        }
      })
    },

    /* 获取编辑详情 */
    initForm(v, copy = false) {
      this.getDic()
      this.jkeForm.visible = true
      this.saleGoodsTable.dataSource = []
      if (v) {
        this.queryParam = v

        if (copy) {
          this.isEdit = false
          this.submitApi = API.saleOrderInfoAdd
          this.queryId = null
          this.jkeForm.title = '新建订单'
        } else {
          this.submitApi = API.saleOrderInfoEdit
          this.isEdit = true
          this.queryId = v.id
          this.jkeForm.title = '编辑订单'
          API.getSaleOrderDetail({ orderId: this.queryId }).then((res) => {
            if (res.code == 200) {
              let list = res.result.records
              this.saleGoodsTable.dataSource = list.map((item) => {
                return {
                  id: item.bsiId,
                  inWarehouseNum: item.serialNumber,
                  serialName: item.serialName || '-',
                  serialNumber: item.serialCode || '-',
                  serialSpecifications: item.serialSpecifications || '-',
                  unitName: item.unitName || '-'
                }
              })
            } else {
              this.$antdMessage.error(res.message)
            }
          })
        }

        let _this = this
        setTimeout(() => {
          _this.form.setFieldsValue({
            orderCustomId: v.orderCustomId,
            orderCustomIdText: v.customName,
            ...v
          })
          _this.$refs.createFormItemRef.setFields({ ...v })
        }, 300)
      } else {
        this.jkeForm.title = '新建订单'
        this.isEdit = false
        this.submitApi = API.saleOrderInfoAdd
        this.queryId = null
      }

      this.getGoods()
    },
    // 商品选择框回显值
    goodsNameText(p) {
      let list = JSON.parse(JSON.stringify(this.saleGoodsTable.dataSource))
      let item = list.filter((i) => {
        return i.id == p.rowId
      })
      return `${item[0].serialNumber ? item[0].serialNumber + ' | ' : ''}${item[0].serialName ? item[0].serialName : ''
        }`
    },
    /* 下拉数据 */
    getGoods() {
      /* 客户下拉 */
      API.getSaleOrderInfoQueryCustom().then((res) => {
        if (res.code == 200) {
          this.customSelectList = res.result
        }
      })
    },
    // 提交
    saveForm(all) {
      this.handleSubmit([], all)
    },
    // 提交
    saveFormEd(newparam1, all) {
      if (this.selectRowKeysEd.length !== 0) {
        const { _, values } = this.$refs.goodsTableEd.getValuesSync({ validate: true })
        let newparamEd = values.filter((item) => this.selectRowKeysEd.includes(item.id))
        //合并两个数组
        let newparam = newparam1.concat(newparamEd)
        this.handleSubmit(newparam, all)
      } else {
      }
      this.handleSubmit(newparam1, all)
    },
    handleSubmit(tableValue, all) {
      this.form.validateFields((err, values1) => {
        if (!err) {
          this.$refs.createFormItemRef.form.validateFields((err, values2) => {
            values1.extDataJson = values2.extDataJson
            if (!err) {
              this.submitTo(tableValue, values1, all)
            } else {
              this.loadingSubmit = false
            }
          })
        }
      })
    },

    submitTo(tableValue, values, all) {
      const { error, values: tableValues } = this.$refs.saleGoodsTable.getValuesSync({ validate: true })
      if (tableValues.length < 1) {
        this.$antdMessage.warning('请添加销售物品明细！')
        return
      }
      let flag = true
      tableValues.forEach((item) => {
        if (item.inWarehouseNum == '' || item.inWarehouseNum == null) {
          flag = false
        } else {
          flag = true
        }
      })

      if (!flag) {
        this.$antdMessage.warning('请完成物品明细的填写')
        return false
      }
      let parameters = {
        id: this.queryId || undefined, //订单id
        ...values,
        saleOrderDetails: tableValues.map((item, index) => {
          return {
            serialId: item.id,
            serialNumber: item.inWarehouseNum,
            sort: index + 1
          }
        })
      }


      // 自定义只读字段的提交
      let extendedFields = this.$refs.createFormItemRef.formTypeExtendedFields
      console.log(Array.isArray(extendedFields), 'formTypeExtendedFields')
      let extDataJson = values.extDataJson
      extendedFields.forEach(item => {
        console.log(item, 'iiii', values.extDataJson)
        for (const itemKey in extDataJson) {
          if (itemKey == item.fieldKey && item.fieldMust == 1) {
            console.log(itemKey, 'itemKeyitemKey')
            extDataJson[itemKey] = item.placeholder
          }
        }
      })

      this.loadingSubmit = true

      this.submitApi(parameters).then((res) => {
        if (res.code == 200) {
          this.loadingSubmit = false
          let subMsg = this.isEdit ? '订单编辑成功！' : '订单添加成功！'
          this.$antdMessage.success(subMsg)
          this.goBack()
        } else {
          this.loadingSubmit = false
          this.$antdMessage.error(res.message)
        }
      })
    },
    submitAll(tableValue, values, all) {
      // tableValue.forEach((item) => {
      //   if (item.inventoryGoodsQualifiedNum == '') {
      //     item.inventoryGoodsQualifiedNum = 0
      //   }
      //   if (item.inventoryGoodsScrapNum == '') {
      //     item.inventoryGoodsScrapNum = 0
      //   }
      //   item.inventoryGoodsQualifiedNum = accMul(item.inventoryGoodsQualifiedNum, item.rateQ)
      //   item.inventoryGoodsScrapNum = accMul(item.inventoryGoodsScrapNum, item.rateS)
      // })
      let that = this
      that.$antdConfirm({
        title: '确定盘点完毕吗?',
        content: `盘点完毕后，无法更改盘点数据`,
        onOk() {
          // console.log(all, 'all 弹窗')
          that.submitTo(tableValue, values, all)
        },
        onCancel() {
        }
      })
    },
    //下拉选择数据接口
    getdata() {
    },
    setColor(props) {
      // if (props.text == 0) {
      //   return '#0f0!important'
      // }
      var newNum = props.text
      var tableValue = this.$refs.goodsTable.getValuesSync({ validate: false, rowIds: [props.rowId] }).values[0]
      // console.log(tableValue, 'tableValuetableValuetableValue')
      if (Number(newNum) > tableValue.goodsQualifiedNum) {
        return '#ff4d4f'
      } else {
        return '#00b042'
      }
    },
    setColor2(props) {
      var newNum = props.text
      var tableValue = this.$refs.goodsTable.getValuesSync({ validate: false, rowIds: [props.rowId] }).values[0]
      if (Number(newNum) > tableValue.goodsScrapNum) {
        return '#ff4d4f'
      } else {
        return '#00b042'
      }
    },
    pdMoney(val, props, tableType) {
      this.$refs[tableType].setValues([
        {
          rowKey: props.rowId, // 行的id
          values: {
            pdAmountExcludingTax: val
          }
        }
      ])
    },
    inputFocus(props) {
      // console.log(props, 'props')
      const isSelect = this.selectRowKeys.filter((each) => each == props.rowId)
      if (isSelect.length == 0) {
        // this.selectRowKeys.push(props.rowId)
        this.$antdMessage.error('请先勾选当前数据')
        // console.log(this.selectRowKeys, 'this.selectRowKeys')
      }
    },
    /* 自动生成 */
    genEntityCode() {
      API.genEntityCode({ entityCode: 'WMS_GOODS' }).then((res) => {
        if (res.code == 200) {
          this.form.setFieldsValue({
            inventoryCode: res.result
          })
        } else {
          this.$antdMessage.error(res.message)
        }
      })
    },
    valueChange(type, row) {
      console.log(type, row, 'value change type')
    },
    getGoodsList() {
      let param = {
        id: this.getGoodsId,
        pageNo: this.getGoodsListPage.current,
        pageSize: this.getGoodsListPage.pageSize
      }
      this.goodsTable.dataSource = []
      this.isLoading = true
      APILX.getGoodsListByWarehouseId(param).then(async (res) => {
        if (res.result) {
          let tableData = res.result.records
          for (let i = 0; i < tableData.length; i++) {
            let item = tableData[i]
            const unitRes = await API.findUnitListByGoodsIdSync({ goodsId: item.goodsId })
            item.unitList = JSON.stringify(unitRes.result)
            item.rateQ = 1
            item.rateS = 1
            item.rateQOld = 1
            item.rateSOld = 1
            item.selectUnitQ = unitRes.result[unitRes.result.length - 1].id
            item.selectUnitS = unitRes.result[unitRes.result.length - 1].id
          }
          tableData.forEach((item) => {
            // const unitRes = await API.findUnitListByGoodsIdSync({goodsId: item.goodsId})
            // item.unitList = JSON.stringify(unitRes.result)
            // item.rateQ = 1
            // item.rateS = 1
            // item.selectUnitQ = unitRes.result[unitRes.result.length-1].id
            // item.selectUnitS = unitRes.result[unitRes.result.length-1].id
            if (item.attachment) {
              let ids = item.attachment
              getFileListByIds({ ids }).then((res) => {
                if (res.code == 200) {
                  let fileList = ''
                  fileList = res.result
                  if (fileList.length > 0) {
                    item.picUrl = this.domianURL + fileList[0].uri
                    this.goodsTable.dataSource.push(item)
                  } else {
                    item.picUrl = require('../../../assets/img/noPicture.jpg')
                    this.goodsTable.dataSource.push(item)
                  }
                }
              })
            } else {
              item.picUrl = require('../../../assets/img/noPicture.jpg')
              this.goodsTable.dataSource.push(item)
            }
          })
          // console.log(this.goodsTable.dataSource, 'this.goodsTable.dataSource')
          this.getGoodsListPage.total = res.result.total
          this.tabNor = `待盘点（${this.getGoodsListPage.total}）`
          this.isLoading = false
        }
      })
    },
    /* 面包屑返回 */
    goBack() {
      this.$emit('refresh')
      this.jkeForm.visible = false
    },
    /* 获取附件 */
    getFileList(v) {
      this.attachment = v
      // console.log('上传的附件id：', v)
    },
    /* 选盘点人 */
    userFilter(v, row) {
      // console.log(v, row)
      this.form.setFieldsValue({
        inventoryUserId: v
      })
      if (row.length > 0) {
        this.signUser = row[0].id
      } else {
        this.signUser = ''
      }
    },
    // 下拉搜索
    filterOption(input, option) {
      // console.log('inputoption', input, option)
      return option.componentOptions.children[0].text.toLowerCase().indexOf(input.toLowerCase()) >= 0
    },
    cancel() {
    },
    setGoodsScrapNum(props) {
      var tableValue = this.$refs.goodsTable.getValuesSync({ validate: false, rowIds: [props.rowId] }).values[0]
      if (tableValue.goodsScrapNum) {
        return tableValue.goodsScrapNum
      } else {
        return ''
      }
    },
    setUnit(props) {
      var tableValue = this.$refs.goodsTable.getValuesSync({ validate: false, rowIds: [props.rowId] }).values[0]
      if (tableValue.assistUnit) {
        return tableValue.assistUnit
      } else {
        return ''
      }
    },
    setSpec(props) {
      var tableValue = this.$refs.goodsTable.getValuesSync({ validate: false, rowIds: [props.rowId] }).values[0]
      if (tableValue.spec) {
        return tableValue.spec
      } else {
        return '-'
      }
    },
    setName(props) {
      var tableValue = this.$refs.goodsTable.getValuesSync({ validate: false, rowIds: [props.rowId] }).values[0]
      if (tableValue.goodsName) {
        return tableValue.goodsName
      } else {
        return ''
      }
    },
    setCode(props) {
      var tableValue = this.$refs.goodsTable.getValuesSync({ validate: false, rowIds: [props.rowId] }).values[0]
      if (tableValue.goodsCode) {
        return tableValue.goodsCode
      } else {
        return ''
      }
    },

    // 已盘点
    setGoodsScrapNumEd(props) {
      var tableValue = this.$refs.goodsTableEd.getValuesSync({ validate: false, rowIds: [props.rowId] }).values[0]
      if (tableValue.goodsScrapNum) {
        return tableValue.goodsScrapNum
      } else {
        return ''
      }
    },
    // 辅助单位账面库存数量
    setNumAssistUnit(props, key, numTextKey) {
      var tableValue = this.$refs[key].getValuesSync({ validate: false, rowIds: [props.rowId] }).values[0]
      // console.log('setNumAssistUnit', tableValue)
      // return tableValue.goodsScrapNumTextAssistUnit || '-'
      return tableValue[numTextKey] || '-'
    },
    setUnitEd(props) {
      var tableValue = this.$refs.goodsTableEd.getValuesSync({ validate: false, rowIds: [props.rowId] }).values[0]
      if (tableValue.assistUnit) {
        return tableValue.assistUnit
      } else {
        return ''
      }
    },
    setSpecEd(props) {
      var tableValue = this.$refs.goodsTableEd.getValuesSync({ validate: false, rowIds: [props.rowId] }).values[0]
      if (tableValue.spec) {
        return tableValue.spec
      } else {
        return ''
      }
    },
    setNameEd(props) {
      var tableValue = this.$refs.goodsTableEd.getValuesSync({ validate: false, rowIds: [props.rowId] }).values[0]
      if (tableValue.goodsName) {
        return tableValue.goodsName
      } else {
        return ''
      }
    },
    setCodeEd(props) {
      var tableValue = this.$refs.goodsTableEd.getValuesSync({ validate: false, rowIds: [props.rowId] }).values[0]
      if (tableValue.goodsCode) {
        return tableValue.goodsCode
      } else {
        return ''
      }
    }
  }
}
</script>
<style scoped lang='less'>
@import '~@/assets/less/public.less';

.flex(@jc, @ai, @fd: row) {
  display: flex;
  justify-content: @jc;
  align-items: @ai;
  flex-direction: @fd;
}

/deep/ .ant-form-vertical {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;

  .ant-form-item {
    width: 30%;
  }
}

.form-body {
  height: calc(100vh - 110px);
  display: flex;
  flex-direction: column;
  overflow: auto;
}

// .form-body {
//   height: calc(100vh - 110px);
//   overflow-y: scroll;
// }
.submitBtn {
  .flex(center, center);
  padding: 8px;
}

.code-btn {
  position: absolute;
  right: 0;
  top: -34.5px;
}

.pic-f {
  box-sizing: border-box;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  padding: 20px 10px;

  .pic-r {
    flex: 1;
    font-size: 14px;
    font-family: Source Han Sans, '思源黑体', Arial, sans-serif, Microsoft YaHei;
    font-weight: 400;
    color: #444444;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;

    .subDiv {
      width: 100%;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    }
  }
}

.imgClass {
  width: 60px;
  height: 60px;
  border-radius: 6px;
}

.my-input {
  padding: 4px 30px 4px 11px;
  border-radius: 3px;
  border: solid 1px #cdcdcd;
}

input::-webkit-input-placeholder {
  color: #cdcdcd;
}

input::-moz-placeholder {
  /* Mozilla Firefox 19+ */
  color: #cdcdcd;
}

input:-moz-placeholder {
  /* Mozilla Firefox 4 to 18 */
  color: #cdcdcd;
}

input:-ms-input-placeholder {
  /* Internet Explorer 10-11 */
  color: #cdcdcd;
}

/deep/ .ant-btn-group .ant-btn {
  border-radius: 4px;
}
</style>
